<template>
	<view>
		<!-- screenBox筛选 -->
		<view class="screenBox flex row-around h90 bg-f col-center">
			<view class="fs26" @click="sortBtn(0)">综合</view>
			
			<view class="flex col-center" @click="sortBtn(1)">
				<text class="mr10 fs26">销量</text>
				<image src="../../static/image/index/shaixuan1.png" class="w14 h18"></image>
			</view>
			<view class="flex col-center" @click="sortBtn(2)">
				<text class="mr10 fs26">价格</text>
				<image src="../../static/image/index/shaixuan1.png" class="w14 h18"></image>
			</view>
		</view>
		<view class="pl30 pr30">
			<!-- 商品列表 -->
			<goodsList :goodslist='goodsList'/>
		</view>
	</view>
</template>

<script>
	import goodsList from '../../components/goodsList/goodsList.vue'
	export default {
		name:'goodslist',
		components:{goodsList},
		onLoad(opt) {
			// console.log(opt)
			this.query.category_id=opt.id
			uni.setNavigationBarTitle({
			    title: opt.title
			});
			this.getGoodsList()
		},
		data() {
			return {
				onloading:false,
				query:{
					category_id:'',
					page:1,
					size:10,
					name:'',
					//销量
					sales:null,
					//价格
					price:null,
					//综合
					type:null
				},
				goodsList:[]
			};
		},
		methods: {
			getGoodsList() {
				this.onloading=true
				this.$api.qualityGoodsCategory(this.query).then(res=>{
					console.log(res)
					this.onloading=false
					this.goodsList=[...this.goodsList,...res.data]
				}).catch(err=>{
					this.onloading=false
				})
			},
			//排序 
			sortBtn(num) {
				if(num==0) {
					if(!this.query.type) {
						this.query.type=1
						console.log('0',this.query.type)
					}else if(this.query.type==1) {
						this.query.type=2
						console.log('1',this.query.type)
					}else {
						this.query.type=1
						console.log('2',this.query.type)
					}
					this.query.price=null
					this.query.sales=null
					this.query.page=1
					this.goodsList=[]
					this.getGoodsList()
				}else if(num==1) {
					if(!this.query.sales) {
						this.query.sales=1
						this.query.price=null
						console.log('0',this.query.sales)
					}else if(this.query.sales==1) {
						this.query.sales=2
						console.log('1',this.query.sales)
					}else {
						this.query.sales=1
						console.log('2',this.query.sales)
					}
					this.query.page=1
					this.query.price=null
					this.query.type=null
					this.goodsList=[]
					this.getGoodsList()
				}else if(num==2) {
					if(!this.query.price) {
						this.query.price=1
						console.log('0',this.query.price)
					}else if(this.query.price==1) {
						this.query.price=2
						console.log('1',this.query.price)
					}else {
						this.query.price=1
						console.log('2',this.query.price)
					}
					this.query.sales=null
					this.query.type=null
					this.query.page=1
					this.goodsList=[]
					this.getGoodsList()
				}
			}
		},
		onReachBottom() {
			if(this.onloading) {
				return
			}
			this.query.page++
			this.getGoodsList()
		}
	}
</script>

<style lang="scss">

</style>
